<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title>No Login Data</title>

		<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
		<meta name="viewport" content="width=device-width, initial-scale=1.0" />
		<title>login successfully</title>
		<link rel="stylesheet" href="../css/style.default.css" type="text/css" />
		<script src="http://libs.baidu.com/jquery/1.11.1/jquery.min.js"></script>
		<script src="../js/baseServerLink.js" type="text/javascript" charset="utf-8"></script>
		<style type="text/css">
			td:nth-child(1) {
				text-align: right;
				width: 40%;
				/*background-color: red;
							*/
			}

			td:nth-child(2) {
				text-align: left;
				width: 60%;
				/*background-color: green;
							*/
			}
		</style>
		<style>
			.redAlert {
				color: red;
				animation: twinkle 1s infinite alternate;
			}

			@keyframes twinkle {
				0% {
					opacity: 0.8;
				}

				100% {
					opacity: 0.2;
				}
			}

			.greenAlert {
				color: green;
			}
		</style>

		<script type="text/javascript">

		</script>


		<style type="text/css">
			.my_green_button {
				background-color: #95f04b;
				border: 0;
				border-radius: 20px;
				-moz-border-radius: 20px;
				/* 老的 Firefox */
				font-family: "Helvetica Neue", Arial, Helvetica, sans-serif;
				font-weight: bold;
				color: #5c8f30;
				border: 1px solid #6eac3a;

			}

			.my_green_button:hover {
				color: #7ecb3f;
			}
		</style>

		<script>

		</script>
		<script type="text/javascript">
			$(function() {
				$("#name").keyup(function() {
					$.ajax({
						url: "../CilabServlet",
						type: "POST",
						data: {
							name: $("#name").val(),
							mode: 42
						},
						success: function(emessage) {
							console.log(emessage);
							eval('emessage = ' + emessage);
							if (emessage['state'] == 'existed') {
								$("#nameside").text('实验室已存在');
								$("#nameside").attr('class', 'redAlert');
								$("#save").attr("disabled", true); //禁用
							} else if (emessage['state'] == 'notfound') {
								$("#nameside").text('Accepted');
								$("#nameside").attr('class', 'greenAlert');
								$("#save").attr("disabled", false); //启用
							} else {}
						},
						error: function(message) {
							alert("服务器访问错误" + message);
						}
					})
				});
			})
		</script>
	</head>

	<body>
		<div class="bodywrapper">
			<div class="topheader orangeborderbottom5">
				<div class="left">
					<h1 class="logo">脸<span>云</span></h1>



					<br clear="all" />

				</div>
				<!--left-->

				<div class="right">

					<!--userdata-->
				</div>
				<!--userinfodrop-->
			</div>
			<!--right-->
		</div>
		<!--topheader-->

		<div class="" style=" ">
			<div class="contentwrapper padding10" style="margin:0 auto; width: 80%; text-align: center;">
				<div class="errorwrapper error403" style=" ">
					<div class="errorcontent">
						<h1>注册新实验室</h1>
						<h3>register new lab</h3>
						<form class="stdform"  method="post" action="../CilabServlet">
							<input type="text" name="mode" value="11" style="display: none;" />
							<br />
							<table border="0" cellspacing="" cellpadding="" width="80%" style="">
								<tr>
									<td><span>实验室位置：</span></td>
									<td>
										<input type="text" name="location" id="location" class="longinput" />
										<br><span id="sidside" class="desc">实验室位置</span>
									</td>
								</tr>
								<tr>
									<td><span>实验室名（唯一）：</span></td>
									<td>
										<input type="text" name="name" id="name" class="longinput">
										<br><span id="nameside" class="desc">系统将检查是否重名</span>
									</td>
								</tr>

								<tr>
									<td><span>备注：</span></td>
									<td>
										<input type="text" name="memo" id="memo" class="longinput">
										<br><span class="desc">备注</span>
									</td>
								</tr>
							</table>
							<br id="br" />
							<div id="uu">
								<button type="submit" id="save" class="stdbtn btn_blue"><span
										style="font-size: larger;">(+)</span><span id="subtext">提交注册</span></button>
							</div>


						</form>

					</div>
					<!--errorcontent-->
				</div>
				<!--errorwrapper-->
			</div>

		</div>


		</div>
		<!--bodywrapper-->

	</body>
</html>
